

const { resolve } = require("path")
const HtmlWebpackPlugin = require("html-webpack-plugin")


/**
 * 
 * entry: 入口起点
 *  1.string ---->  "src/index.js"   单入口
 *      打包生成一个chunk，输出一个bundle文件, 默认的chunk名称为main
 * 
 *  2.array  ---->  ["./src/index.js", "./src/js/add.js"]  多入口
 *      所有的入口文件只会形成一个chunk，数组中的文件会被整合成一个，输出的只有一个bundle文件
 *       ---->一般来讲只有在HMR中，使html文件热更新生效的时候会使用。
 *    
 *  3.object ----> { main: "./src/index.js",  test: "./src/js/add.js" } 多入口
 *      有几个入口就有几个chunk，输出几个bundle文件
 *      此时的chunk名为对象中的key
 *      --->2和3组合使用  {
 *                          main: ["./src/index.js", "./src/js/add.js"] ,
 *                          test: "./src/js/add.js"
 *                        }
 *  4.function
 * 
 * 
 */

module.exports = {
    entry: "./src/index.js",
    output: {
        filename: "[name].js",
        path: resolve(__dirname, "build")
    },
    plugins: [ 
        new HtmlWebpackPlugin()
    ],
    mode: "development"
}